<template>
	<view @click="goToCourse" class="flex">
		<!-- 封面 -->
		<view  class="margin-right" style="border: #55aaff solid 1rpx;box-shadow: #55aaff 2rpx 3rpx 5rpx;">
			<image :src="course.cover" mode="aspectFit" style="height: 280rpx;width: 250rpx;"> </image>
		</view>
		<!-- 书籍、期刊基本信息 -->
		<view class="flex flex-direction" style="position: relative;">
			<!-- 题目、书名 -->
			<view style="font-weight: 600; margin-bottom: 30rpx;" >{{course.title}}</view>
			<!-- 描述信息 -->
			<view style="display: -webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2 ;overflow:hidden;font-weight: 500;color: rgba(255, 59, 48, 1);">￥{{course.price}}</view>
			<!-- 相关统计信息 -->
			<view style="position: absolute;bottom: 2%; width: 200rpx;">{{course.buyCount}}人购买</view>
		</view>
		
	</view>
</template>

<script>
	export default{
		props:{
			course:{
				type:Object
			}
		},
		methods: {
			goToCourse(){
				this.$Router.push({
					name:'courseDetail',
					params:{
						id: this.course.contentId,
					},
				});
			}
		}
	}
</script>

<style lang="scss">
</style>
